package com.fhc.view

import androidx.annotation.IntRange
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.gestures.detectTapGestures
import androidx.compose.foundation.gestures.draggable
import androidx.compose.foundation.gestures.rememberDraggableState
import androidx.compose.foundation.indication
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.BoxWithConstraints
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Card
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme.colorScheme
import androidx.compose.material3.RangeSlider
import androidx.compose.material3.Slider
import androidx.compose.material3.SliderDefaults
import androidx.compose.material3.ripple
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableFloatStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.DpSize
import androidx.compose.ui.unit.IntOffset
import androidx.compose.ui.unit.dp
import kotlin.math.abs
import kotlin.math.roundToInt


@OptIn(ExperimentalMaterial3Api::class)
@Preview
@Composable
fun FhcSlider(
    modifier: Modifier= Modifier, value:Float = 0f,
    color: Color =  Color.White,
    @IntRange(from = 0) steps: Int = 0,
    valueRange: ClosedFloatingPointRange<Float> = 0f..100f,onValueChange: (Float) -> Unit ={} ){
    val interactionSource = remember { MutableInteractionSource() }
    val trackHeight = 4.dp
    val thumbSize = DpSize(16.dp, 16.dp)
    Slider(
        modifier = modifier,
        value = value,
        onValueChange = onValueChange,
        valueRange = valueRange,
        steps = steps,
        thumb = {
            val modifier = Modifier.size(thumbSize)
                .shadow(1.dp, CircleShape, clip = false)
                .indication(
                    interactionSource = interactionSource,
                    indication = ripple(bounded = false, radius = 16.dp)
                )
            SliderDefaults.Thumb(interactionSource = interactionSource, modifier = modifier, colors = SliderDefaults.colors().copy(  // 单独覆盖轨道颜色
                thumbColor = color,  // 滑块颜色
            ))
        },
        track = {
            val modifier = Modifier.height(trackHeight)
            SliderDefaults.Track(
                sliderState = it,
                modifier = modifier,
                thumbTrackGapSize = 0.dp,
                trackInsideCornerSize = 0.dp,
                drawStopIndicator = null,
                colors = SliderDefaults.colors().copy(  // 单独覆盖轨道颜色
                    activeTrackColor = color.copy(alpha = 0.6f),
                    inactiveTrackColor = color.copy(alpha = 0.2f),
                    activeTickColor = color,  // 激活刻度颜色
                    inactiveTickColor = color  // 未激活刻度颜色
                ),

                )
        }
    )
}




@OptIn(ExperimentalMaterial3Api::class)
@Preview
@Composable
fun FhcRangeSlider(
    modifier: Modifier = Modifier,
    value: ClosedFloatingPointRange<Float> = 20f..50f,
    @IntRange(from = 0) steps: Int = 0,
    valueRange: ClosedFloatingPointRange<Float> = 0f..100f,
    onValueChange: (ClosedFloatingPointRange<Float>) -> Unit = {}
) {
    val interactionSource = remember { MutableInteractionSource() }
    val trackHeight = 4.dp
    val thumbSize = DpSize(16.dp, 16.dp)

    RangeSlider(
        modifier = modifier,
        value = value,
        onValueChange = onValueChange,
        valueRange = valueRange,
        steps = steps,
        startThumb = {
            val modifier = Modifier.size(thumbSize)
                .shadow(1.dp, shape = CircleShape, clip = false)
                .indication(
                    interactionSource = interactionSource,
                    indication = ripple(bounded = false, radius = 16.dp)
                )
            SliderDefaults.Thumb(
                interactionSource = interactionSource,
                modifier = modifier,
                thumbSize = thumbSize,
                colors = SliderDefaults.colors().copy(
                    thumbColor = colorScheme.onPrimary
                )
            )
        },
        endThumb = {
            val modifier = Modifier.size(thumbSize)
                .shadow(1.dp, shape = CircleShape, clip = false)
                .indication(
                    interactionSource = interactionSource,
                    indication = ripple(bounded = false, radius = 16.dp)
                )
            SliderDefaults.Thumb(
                interactionSource = interactionSource,
                modifier = modifier,
                thumbSize = thumbSize,
                colors = SliderDefaults.colors().copy(
                    thumbColor = colorScheme.onPrimary
                )
            )
        },
        track = { sliderState ->
            val modifier = Modifier.height(trackHeight)
            SliderDefaults.Track(
                rangeSliderState  = sliderState,
                modifier = modifier,
                thumbTrackGapSize = 0.dp,
                trackInsideCornerSize = 0.dp,
                colors = SliderDefaults.colors().copy(
                    activeTrackColor = colorScheme.primary.copy(alpha = 0.6f),
                    inactiveTrackColor = Color.White.copy(alpha = 0.2f),
                    activeTickColor = colorScheme.primary,
                    inactiveTickColor = Color.White
                )
            )
        }
    )
}



@Preview
@Composable
fun FhcVerticalSlider(
    modifier: Modifier= Modifier,
    progress: Int = 50,
    maxProgress: Int = 100,
    thumbColor:Color = colorScheme.primary,
    sliderColor:Color = Color(0xFFDDE1ED),
    progressColor:Color = Color(0xff6297FF),
    onValueChange: (Int) -> Unit ={}) {

    BoxWithConstraints(modifier = modifier) {

        val thumbSize = maxWidth
        val barWidth = maxWidth / 5 * 2
        val length = maxHeight
        val maxLengthPx = with(LocalDensity.current) {
            (length - thumbSize).toPx()
        }

        var offsetX by remember(progress) {
            mutableFloatStateOf(maxLengthPx * (progress * 1f / maxProgress))
        }

        // 创建并获取一个DraggableState实例
        val draggableState = rememberDraggableState {
            // 使用回调方法回传的参数对状态偏移量进行累加，并限制范围
            val newValue = (offsetX - it).coerceIn(0f, maxLengthPx)
            if (newValue == offsetX) return@rememberDraggableState
            offsetX = newValue
            onValueChange.invoke((maxProgress * (abs(offsetX) / maxLengthPx)).roundToInt())
        }

        Spacer(
            modifier = Modifier
                .then(Modifier.pointerInput(this) {
                    detectTapGestures(
                        onTap = {
                            offsetX = (maxLengthPx - it.y)
                            onValueChange.invoke((maxProgress * (abs(offsetX) / maxLengthPx)).roundToInt())
                        }
                    )
                })
                .fillMaxHeight()
                .width(barWidth)
                .align(Alignment.BottomCenter)
                .background(sliderColor, shape = RoundedCornerShape(50)))

        Spacer(
            modifier = Modifier
                .height(with(LocalDensity.current) { offsetX.toDp() } + barWidth)
                .width(barWidth)
                .align(Alignment.BottomCenter)
                .background(progressColor, shape = RoundedCornerShape(topStart  =0.dp,
                    topEnd  = 0.dp,
                    bottomEnd = barWidth/2,
                    bottomStart = barWidth/2)))
        Card(
            modifier = Modifier
                .size(thumbSize)
                .align(Alignment.BottomCenter)
                .offset { IntOffset(0, if(offsetX.isNaN()) 0 else -offsetX.roundToInt()) }
                .draggable(
                    orientation = Orientation.Vertical,
                    state = draggableState
                ),
            colors = CardDefaults.cardColors(containerColor = thumbColor),
            shape = CircleShape,
            elevation = CardDefaults.elevatedCardElevation(defaultElevation = 1.dp)) {
//            Icon(
//                imageVector = Icons.Default.Circle,
//                tint = Color.Unspecified,
//                contentDescription = null,
//                modifier = Modifier
//                    .padding(2.dp)
//                    .fillMaxSize())
        }

//
//        Box(
//            modifier = Modifier
//                .size(width = thumbSize, height = 10.dp)
//                .align(Alignment.BottomCenter)
//                .offset { IntOffset(0, if(offsetX.isNaN()) 0 else -offsetX.roundToInt()) }
//                .draggable(
//                    orientation = Orientation.Vertical,
//                    state = draggableState
//                ).background(color =thumbColor,shape = RoundedCornerShape(4.dp))) {
//
//        }
    }
}
